<template>
  <div>
    我是爸爸 <br />
    ====count=={{ $store.state.count }} <br />
    ===映射{{ count }} <br />
    <button @click="add">点我count++</button> <br />
    <button @click="addSync">按钮sync</button>
    <br />
    求和==={{ $store.getters.total }}===映射{{ total }}
    <br />
    addModules:年龄=={{ $store.state.user.userInfo.age }}
    <button @click="addModules">addModules</button>
    <hr />
    <Son></Son>
  </div>
</template>
<script>

import Son from './Son.vue'
import { mapState, mapMutations, mapActions, mapGetters } from 'vuex'
export default {
  name: '',
  components: {
    Son
  },
  data () {
    return {
      obj: {
        m: 100
      },
      list: [1, 2, 3, 4, 5, 6, 7, 8, 9]
    }
  },
  created () {
    console.log(this)

  },
  computed: {
    ...mapState(['count']),
    ...mapGetters(['total'])

  },
  methods: {
    ...mapMutations(['addHandle']),
    ...mapActions(['syncHandle']),
    add () {
      this.$store.commit('addHandle', this.obj)
      //映射方式+传参
      // this.addHandle(5)
    },
    addSync () {
      // this.$store.dispatch('syncHandle')
      //映射方式+传参
      // this.addHandle(5)
      this.syncHandle(5)

    },
    addModules () {
      this.$store.commit('user/addModules')
    }
  }
}
</script>
<style lang='less'  scoped>
</style>
